/*global Qiniu */
/*global plupload */
/*global FileProgress */
/*global hljs */


$(function() {
    var elem_id = 'pickfiles';
    var container_id = 'container';
    

    document.getElementById('up').onclick=function(){
        up_img(elem_id, container_id);
    }

    function up_img(elem_id, container_id) {
        uploader = Qiniu.uploader({
            runtimes: 'html5,flash,html4',
            browse_button: elem_id,
            container: container,
            drop_element: 'container',
            flash_swf_url: 'bower_components/plupload/js/Moxie.swf',
            dragdrop: true,
            chunk_size: '4mb',

            // uptoken_url: $('#uptoken_url').val(),
            //uptoken:"um6IEH7mtwnwkGpjImD08JdxlvViuELhI4mFfoeL:zPVaMyRvtEgsfbKKuIPpMobH6nc=:eyJzY29wZSI6ImphdmFkZW1vIiwiZGVhZGxpbmUiOjIzNjY1NjI3MjZ9Cg==",
            // multi_selection: !(mOxie.Env.OS.toLowerCase()==="ios"),
            uptoken_func: function() {
                var chars = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'];

                var q_url = 'http://106.75.137.2:8888/api/admin/pedia/up_token/?filename=';

                f_name = generateMixed(15);

                function generateMixed(n) {
                    var res = "";
                    for (var i = 0; i < n; i++) {
                        var id = Math.ceil(Math.random() * 35);
                        res += chars[id];
                    }
                    return res;
                }

                f_name = "test_image";

                q_url = q_url + f_name;

                var uptoken = '';

                function createXHR() {
                    if (window.XMLHttpRequest) {
                        // 新浏览器
                        return new XMLHttpRequest();
                    } else if (window.ActiveXObject) {
                        // IE5,IE6
                        return new ActiveXObject("Microsoft.XMLHTTP");
                    }
                }

                var xhr = createXHR();

                function xhrthen(xhr, callback) {
                    xhr.onreadystatechange = function() {
                        if (xhr.readyState == 4) {
                            if (xhr.status >= 200 && xhr.status < 300 || xhr.status == 304) {
                                console.log(xhr.responseText)
                                callback();
                            } else {
                                console.log(xhr.status)
                                console.log(xhr.responseText)
                                callback();
                            }
                        }
                    };
                };
                xhrthen(xhr, function() {
                    respon = JSON.parse(xhr.responseText);
                    uptoken = respon.up_token;
                });

                xhr.open('get', q_url, false);
                xhr.send();
                console.log(f_name)
                console.log(uptoken)
                return uptoken;
            },

            filters: {
                max_file_size: '100000mb',
                prevent_duplicates: true,
                //Specify what files to browse for
                mime_types: [
                    // {title : "mp4 files", extensions : "mkv"}
                    // {title : "flv files", extensions : "flv,jpg"}
                    // {title : "Video files", extensions : "flv,mpg,mpeg,avi,wmv,mov,asf,rm,rmvb,mkv,m4v,mp4"}
                    // {title : "Video files", extensions : "avi,mp4,wmv,mpg,mov,flv,mkv,mpeg"}
                    // {title : "Image files", extensions : "jpg,gif,png"}
                    // {title : "Zip files", extensions : "zip"}
                ]
            },
            // uptoken_func: function(){
            //     var ajax = new XMLHttpRequest();
            //     ajax.open('GET', $('#uptoken_url').val(), false);
            //     ajax.setRequestHeader("If-Modified-Since", "0");
            //     ajax.send();
            //     if (ajax.status === 200) {
            //         var res = JSON.parse(ajax.responseText);
            //         console.log('custom uptoken_func:' + res.uptoken);
            //         return res.uptoken;
            //     } else {
            //         console.log('custom uptoken_func err');
            //         return '';
            //     }
            // },
            domain: "http://o8covea2w.bkt.clouddn.com/",
            get_new_uptoken: false,
            resize: {
                width: 10,
                height: 10,
                crop: true,
                quality: 100,
                preserve_headers: true
            },
            // downtoken_url: '/downtoken',
            // unique_names: true,
            // save_key: true,
            // x_vars: {
            //     'id': '1234',
            //     'time': function(up, file) {
            //         var time = (new Date()).getTime();
            //         // do something with 'time'
            //         return time;
            //     },
            // },
            auto_start: true,
            log_level: 5,
            init: {
                'QueueChanged': function(up) {
                    console.log('change')
                },
                'FilesAdded': function(up, files) {
                    console.log('add')
                    $('table').show();
                    $('#success').hide();
                    plupload.each(files, function(file) {
                        var progress = new FileProgress(file, 'fsUploadProgress');
                        progress.setStatus("等待...");
                        progress.bindUploadCancel(up);
                    });
                },
                'BeforeUpload': function(up, file) {
                    console.log('before')
                    var msize = file.size / 1024;
                    console.log(msize)
                    var progress = new FileProgress(file, 'fsUploadProgress');
                    var chunk_size = plupload.parseSize(this.getOption('chunk_size'));
                    if (up.runtime === 'html5' && chunk_size) {
                        progress.setChunkProgess(chunk_size);
                    }
                },
                'UploadFile': function(up, file) {
                    console.log('upload')
                    var msize = file.size / 1024;
                    console.log(msize)
                },
                'UploadProgress': function(up, file) {

                    console.log('progress')
                    var msize = file.size / 1024;
                    console.log(msize)
                    up.stop();
                    console.log('stop')
                        // up.refresh();
                        // console.log('refresh')

                    var progress = new FileProgress(file, 'fsUploadProgress');
                    var chunk_size = plupload.parseSize(this.getOption('chunk_size'));
                    progress.setProgress(file.percent + "%", file.speed, chunk_size);
                },
                'UploadComplete': function() {
                    $('#success').show();
                },
                'FileUploaded': function(up, file, info) {
                    console.log('ed')
                    var msize = file.size / 1024;
                    console.log(msize)
                    var progress = new FileProgress(file, 'fsUploadProgress');
                    progress.setComplete(up, info);
                },
                'FileFiltered': function(up, file) {
                    console.log('filter')
                    var msize = file.size / 1024;
                    console.log(msize)
                },
                'Error': function(up, err, errTip) {
                    $('table').show();
                    var progress = new FileProgress(err.file, 'fsUploadProgress');
                    progress.setError();
                    progress.setStatus(errTip);
                },
                'Key': function(up, file) {
                    var key = f_name;
                    // do something with key
                    return key
                }
            }
        });
    }












    $('table').show();

    uploader.bind('FileUploaded', function() {
        console.log('hello man,a file is uploaded');
    });
    $('#container').on(
        'dragenter',
        function(e) {
            e.preventDefault();
            $('#container').addClass('draging');
            e.stopPropagation();
        }
    ).on('drop', function(e) {
        e.preventDefault();
        $('#container').removeClass('draging');
        e.stopPropagation();
    }).on('dragleave', function(e) {
        e.preventDefault();
        $('#container').removeClass('draging');
        e.stopPropagation();
    }).on('dragover', function(e) {
        e.preventDefault();
        $('#container').addClass('draging');
        e.stopPropagation();
    });



    $('#show_code').on('click', function() {
        $('#myModal-code').modal();
        $('pre code').each(function(i, e) {
            hljs.highlightBlock(e);
        });
    });


    $('body').on('click', 'table button.btn', function() {
        $(this).parents('tr').next().toggle();
    });


    var getRotate = function(url) {
        if (!url) {
            return 0;
        }
        var arr = url.split('/');
        for (var i = 0, len = arr.length; i < len; i++) {
            if (arr[i] === 'rotate') {
                return parseInt(arr[i + 1], 10);
            }
        }
        return 0;
    };

    $('#myModal-img .modal-body-footer').find('a').on('click', function() {
        var img = $('#myModal-img').find('.modal-body img');
        var key = img.data('key');
        var oldUrl = img.attr('src');
        var originHeight = parseInt(img.data('h'), 10);
        var fopArr = [];
        var rotate = getRotate(oldUrl);
        if (!$(this).hasClass('no-disable-click')) {
            $(this).addClass('disabled').siblings().removeClass('disabled');
            if ($(this).data('imagemogr') !== 'no-rotate') {
                fopArr.push({
                    'fop': 'imageMogr2',
                    'auto-orient': true,
                    'strip': true,
                    'rotate': rotate,
                    'format': 'png'
                });
            }
        } else {
            $(this).siblings().removeClass('disabled');
            var imageMogr = $(this).data('imagemogr');
            if (imageMogr === 'left') {
                rotate = rotate - 90 < 0 ? rotate + 270 : rotate - 90;
            } else if (imageMogr === 'right') {
                rotate = rotate + 90 > 360 ? rotate - 270 : rotate + 90;
            }
            fopArr.push({
                'fop': 'imageMogr2',
                'auto-orient': true,
                'strip': true,
                'rotate': rotate,
                'format': 'png'
            });
        }

        $('#myModal-img .modal-body-footer').find('a.disabled').each(function() {

            var watermark = $(this).data('watermark');
            var imageView = $(this).data('imageview');
            var imageMogr = $(this).data('imagemogr');

            if (watermark) {
                fopArr.push({
                    fop: 'watermark',
                    mode: 1,
                    image: 'http://www.b1.qiniudn.com/images/logo-2.png',
                    dissolve: 100,
                    gravity: watermark,
                    dx: 100,
                    dy: 100
                });
            }

            if (imageView) {
                var height;
                switch (imageView) {
                    case 'large':
                        height = originHeight;
                        break;
                    case 'middle':
                        height = originHeight * 0.5;
                        break;
                    case 'small':
                        height = originHeight * 0.1;
                        break;
                    default:
                        height = originHeight;
                        break;
                }
                fopArr.push({
                    fop: 'imageView2',
                    mode: 3,
                    h: parseInt(height, 10),
                    q: 100,
                    format: 'png'
                });
            }

            if (imageMogr === 'no-rotate') {
                fopArr.push({
                    'fop': 'imageMogr2',
                    'auto-orient': true,
                    'strip': true,
                    'rotate': 0,
                    'format': 'png'
                });
            }
        });

        var newUrl = Qiniu.pipeline(fopArr, key);

        var newImg = new Image();
        img.attr('src', 'images/loading.gif');
        newImg.onload = function() {
            img.attr('src', newUrl);
            img.parent('a').attr('href', newUrl);
        };
        newImg.src = newUrl;
        return false;
    });

});
